@import "../../../styles/default";
.news-header{
  position: relative;
  .news-header-tab{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 30px;
    margin: auto;
    color: $text-ph-color;
  }
}

.app-news-wrapper{
  .app-news-item-wrapper{
    padding: size(8) pxToRem(12);
    .app-news-item-time {

    }
    &.important {
      .app-news-item-content{
        color: $danger;
      }
    }
    .app-news-item-content{
      padding: size(8) 0;
      font-size: pxToRem(14);
    }
  }
}
.app-calendar-wrapper{
  height: 100%;
  display: flex;
  flex-direction: column;
  .app-calendar-wrapper-content {
    overflow-y: scroll;
    flex: 1;
    &::-webkit-scrollbar{
      display: none;
    }
  }
}

.calendar-item-info, .event-item-time{
  display: flex;
  align-items: center;
  .seize {
    flex: 1;
  }
}
.calendar-box{
  width: 100%;
  overflow-x: scroll;
  overflow-y: hidden;
  display: flex;
  position: relative;
  background: $theme-deep-background;
  &::-webkit-scrollbar{
    display: none;
  }
  .calendar-box-item{
    width: 14.285%;
    text-align: center;
    color: $text-ph-color;
    flex: 0 0 14.285%;
    position:relative;
    font-size: 10px;
    cursor: pointer;
    .calendar-month{
      position: absolute;
      right: -12px;
      top: 0px;
      font-size: 9px;
      font-weight: bold;
    }
    p {
      margin: 4px 0;
    }
    &.active {
      color: $active-color;
      &::after {
        width: 100%;
        position: absolute;
        content: ' ';
        height: pxToRem(4);
        background: $active-color;

        left: 0;
        bottom: -2px;
      }
    }
  }
}
.calendar-item-wrapper{
  padding: size(8) pxToRem(12);
  display: flex;
  position: relative;
  align-items: center;
  &::after {
    position: absolute;
    bottom: 0;
    content: ' ';
    width: 100%;
    height: 1px;
    transform: scaleY(0.1);
    background: #9e9e9e;
    left: 0;
  }
  .calendar-item-flag{
    padding-right: pxToRem(12);
    .calendar-item-img{
      width: pxToRem(32);
    }
  }
  .calendar-item-box{
    width: 100%;
    .calendar-item-title{

    }
    .calendar-item-data{
      display: flex;
      .calendar-data-info{
        flex: 1;
      }
    }
    .calendar-item-fluence{
      font-size: pxToRem(14);
      padding: size(8) 0;
    }
  }
}
.event-item-wrapper{
  display: flex;
  align-items: center;
  padding: size(8) pxToRem(12);
  position: relative;
  .event-item-flag{
    padding-right: pxToRem(12);
    .event-item-img{
      width: pxToRem(32);
    }
  }
  .event-item-content{
    flex: 1;
    .event-item-content-info{
      font-size: pxToRem(12);
      color: $text-ph-color;
      font-family: "PingFang SC";
    }
  }
  &::after {
    position: absolute;
    content: ' ';
    bottom: 0;
    left: 0;
    height: 1px;
    transform: scaleY(0.5);
    background: #9e9e9e;
    width: 100%;
  }
}
